<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>注册</title>
    <link href="css/bootstrap.css" rel="stylesheet" type="text/css">
    <link href="css/mystyle.css" rel="stylesheet" type="text/css">
    <script type="text/javascript">
        //切换验证码
        function refreshCode(){
            //1.获取验证码图片对象
            var vcode = document.getElementById("vcode");

            //2.设置其src属性，加时间戳
            vcode.src = "${pageContext.request.contextPath}/checkCodeServlet?time="+new Date().getTime();
        }
    </script>
</head>
<body>
<!-- 顶部banner -->
<div class="container">
    <div class="banner">
        <ul class="nav nav-pills topmenu">
            <li role="presentation"><a href="${pageContext.request.contextPath}/productServlet">主页</a></li>
            <li role="presentation"><a href="CommodityRegistered.jsp">用户注册</a></li>
            <li role="presentation"><a href="CommodityForgetPassword.jsp">忘记密码</a></li>
            <li role="presentation"><a href="${pageContext.request.contextPath}/feedbackServlet?demand=showAll">意见反馈</a></li>
        </ul>
    </div>
</div>

<br>


<div class="container">
    <form class="form-horizontal" method="post">

        <!--用户名-->
        <div class="form-group">
            <label for="inputUser" class="col-sm-2 control-label">用户名</label>
            <div class="col-sm-6">
                <input name="name" type="user" class="form-control" id="inputUser" placeholder="请输入您的用户名">
            </div>
            <div class="col-sm-4">
                <strong>${registerCustomerRepetition_msg}</strong>
            </div>
        </div>

        <!--密码-->
        <div class="form-group">
            <label for="inputPassword" class="col-sm-2 control-label">密码</label>
            <div class="col-sm-6">
                <input name="password" type="password" class="form-control" id="inputPassword" placeholder="请输入您的密码">
            </div>
            <div class="col-sm-4"></div>
        </div>

        <!--头像选择-->
        <div class="form-group">
            <%--@declare id="selectimg"--%>
            <label for="selectImg" class="col-sm-2 control-label">选择头像</label>
            <div class="col-sm-6">
                <input name="header" type="file" id="exampleInputFile" placeholder="请选择图片">
            </div>
            <div class="col-sm-4"></div>
        </div>

        <!--联系电话-->
        <div class="form-group">
            <label for="tel" class="col-sm-2 control-label">联系电话</label>
            <div class="col-sm-6">
                <input name="phone" type="tel" class="form-control" id="tel" placeholder="请输入您的联系电话">
            </div>
            <label class="col-sm-4"></label>
        </div>

        <!--问题提示-->
        <div class="form-group">
            <%--@declare id="question"--%>
            <label for="question" class="col-sm-2 control-label">问题提示</label>
            <div class="col-sm-6">
                <select name="question" class="form-control">
                    <option>你梦想的职业是什么？</option>
                    <option>你的初恋是谁？</option>
                    <option>你最喜欢的食物是什么？</option>
                    <option>你任职的第一家公司是什么?</option>
                    <option>你的幸运数字是什么?</option>
                </select>
            </div>
            <div class="col-sm-4"></div>
        </div>

        <!--问题答案-->
        <div class="form-group">
            <label for="answer" class="col-sm-2 control-label">问题答案</label>
            <div class="col-sm-6">
                <input name="answer" type="text" class="form-control" id="answer" placeholder="请输入问题的答案">
            </div>
            <div class="col-sm-4"></div>
        </div>

        <!--所在地址-->
        <div class="form-group">
            <label for="address" class="col-sm-2 control-label">所在地址</label>
            <div class="col-sm-6">
                <input name="address" type="text" class="form-control" id="address" placeholder="请输入您的地址">
            </div>
            <div class="col-sm-4"></div>
        </div>

        <!--Email-->
        <div class="form-group">
            <label for="email" class="col-sm-2 control-label">Email</label>
            <div class="col-sm-6">
                <input name="email" type="email" class="form-control" id="email" placeholder="请输入您的Email">
            </div>
            <div class="col-sm-4"></div>
        </div>

        <div class="form-inline">
            <label for="vcode" class="col-sm-2 control-label">验证码：</label>
            <div class="col-sm-3">
                <input type="text" name="verifyCode" class="form-control" id="verifycode" placeholder="请输入验证码" style="width: 220px;"/>
            </div>
            <div class="col-sm-4">
                <a href="javascript:refreshCode();">
                    <img src="${pageContext.request.contextPath}/checkCodeServlet" title="看不清点击刷新" id="vcode"/>
                </a>
            </div>
            <div class="col-sm-3">
                <strong>${verifyCodeError_msg}</strong>
            </div>

        </div>

        <!--注册--返回-->
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-6">
                &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp;
                &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;
                <input class="btn btn-info btn btn-primary" type="submit" formaction="${pageContext.request.contextPath}/registerServlet?demand=customerRegister" value="注册">
                &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;
                <input class="btn btn-info btn btn-primary" type="submit" formaction="${pageContext.request.contextPath}/CommodityHome.jsp" value="返回">
            </div>
        </div>
    </form>
</div>

<br>

<!--注意事项-->
<div class="container showMove panel-footer">
    <h4 class="box">注意事项</h4>
    <p class="box">1.用户自行承担注册账号及密码的保管责任，并就其账号及密码项下之一切活动负全部责任。</p>
    <p class="box">2.用户应注意网络安全防护，定期更改密码、设置密码安全保护问题，防止账号密码泄露，保证个人信息安全。</p>
    <p class="box">3.用户保证所填写的用户信息是真实、准确、完整的，没有任何引人误解或者虚假的陈述，承诺将及时更新其用户信息以维持信息有效性。</p>
    <p class="box">4.如用户提供的资料或信息包含有不真实、不准确的信息，唯奥资本网有权采取关闭该用户账户、结束为该用户提供网络服务等处理措施。</p>
</div>

<div class="footerbg center showMove">
    <p> Designed and built with all the love in the world by @mdo and @fat. Maintained by the core team with the help of
        our contributors.</p>
</div>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
